<template>
   <div>
      <el-table :data="userDatas" border style="width: 200%">
         <el-table-column fixed prop="userType" label="权限(0：超级用户，1：普通用户)" width="350"></el-table-column>
         <el-table-column prop="userName" label="姓名" width="200"> </el-table-column><el-table-column fixed="right"
            label="操作" width="500">
            <template slot-scope="scope">
               <el-button @click="dianjibianji(scope.$index, scope.row)" type="text" size="small">编辑</el-button>
               <!-- <el-button type="text" size="small">删掉</el-button> -->
            </template>
         </el-table-column>
      </el-table>
      <!-- <el-button type="text" @click="dialogFormVisible = true">打开嵌套表单的 Dialog</el-button> -->
      <el-dialog title="角色管理" :visible.sync="dialogFormVisible">
         <el-form :model="usertable">
            <!-- <el-form-item label="权限范围" :label-width="formLabelWidth"> -->
            <!-- <label >{{usertable.userName  }}</label> -->
            <!-- <el-checkbox-group v-model="checkedCities" :min="0" :max="2">
                  <el-checkbox checked="true" >超级用户</el-checkbox>
                  <el-checkbox checked="false"  >普通用户</el-checkbox>
               </el-checkbox-group>
            </el-form-item> -->
            <template>
               <el-radio v-model="radio" label="0">超级用户</el-radio>
               <el-radio v-model="radio" label="1">普通用户</el-radio>
            </template>
         </el-form>
         <div slot="footer" class="dialog-footer">
            <el-button @click="dialogFormVisible = false">取 消</el-button>
            <el-button type="primary" @click="aaa()">确 定</el-button>
         </div>
      </el-dialog>
   </div>
</template>
 
<script>
import axios from 'axios';
const cityOptions = ["普通用户", "超级用户"];

export default {
   data() {
      return {
         radio: 0,
         id: 1,
         cq: 0,
         userDatas: [],
         checkedCities: [1],//编辑勾选
         cities: cityOptions,//编辑勾选选择内容 如：
         // dialogTableVisible: false,

         dialogFormVisible: false,
         usertable: {
            userName: '1',
         },
         formLabelWidth: '120px',
         tableData: [],
         //用户信息
      }
   },

   mounted() {
      //this.dengIu()
      //this.userData();
      // this.userDatas=1;
      // console.log(this.userDatas);
      // axios({
      //    url: '/api/user/getUserList',
      //    method: "get",
      // }).then(function (res) {
      //    console.log(res.data.data);
      //    // this.userDatas.push(res.data.data)
      // })
   },
   created() {
      this.uaerData()
   },
   methods: {
      // handleEdit(index, row) {
      //    this.show = true;
      //    console.log(index, row);
      // },
      // handleDelete(index, row) {
      //    console.log(index, row);
      // },
      dianjibianji(index, row) {
         this.id = row.id
         this.cq = row.userType
         this.dialogFormVisible = true
         
         console.log(this.id, this.cq);

         //this.usertable=row.userName
         //console.log(this.usertable);
         // that.from.userName=row.userName


      },
      uaerData() {
         const that = this
         axios({
            url: 'https://lvyou.free.svipss.top/user/getuserlist',
            method: "get",
         }).then(function (res) {
            console.log(res.data.data);
            that.userDatas = res.data.data;

         })
      },
      // shangchuan() {
      //    const that=this
      //    axios({
      //       url: 'https://lvyou.free.svipss.top/user/getuserlist',
      //       method: "get",
      //    }).then(function (res) {
      //       console.log(res.data.data);
      //       that.userDatas=res.data.data
      //    })
      // },
      aaa() {
         const that = this
         console.log("jjj" + this.radio);
         axios({
            url: 'https://lvyou.free.svipss.top/user/updateuser?id=' + this.id + "&cq=" + this.radio,
            method: "get",
         }).then(function (res) {
            console.log(res.data.data);
            //that.userDatas = res.data.data
         })
         this.dialogFormVisible = false;
      }
      // dengIu() {

      //    let sdata = {
      //       checkedCities: this.checkedCities,
      //       cities: this.cities
      //    };
      //    axios({
      //       url: '/api/user/getUserList',
      //       method: "get",
      //       // data: sdata
      //    }).then(function (res) {
      //       console.log(res.data.data);
      //       //this.userData = res.data.data;

      //       //console.log(this.userData);
      //       // this.tableData = res.data.data
      //       // console.log(this.tableData);
      //       // for(let i=0;i<this.tableData.lengt;i++){
      //       //    if(this.tableData[i].checkedCities==1){
      //       //       this.tableData[i].checkedCities='前台权限'
      //       //    }
      //       // }


      //    }).catch(function (res) {
      //       console.log(res, "失败");
      //    })
      // }

   }
}
</script>

